import React, { useState, useEffect } from 'react';
import { Spin, Layout, Form, Input, Button, message } from 'antd';
import {
  CopyrightOutlined,
  LockOutlined,
  UserOutlined,
} from '@ant-design/icons';
import styles from './index.less';
import { request, history } from 'umi';
import Jwt_decode from 'jwt-decode';
import { login } from './api';
import { encrypt, decrypt } from '../../utils/encrypt';

const { Content, Footer } = Layout;

const Index = () => {
  const [form] = Form.useForm();
  const [loading, setLoading] = useState(false);

  useEffect(() => {
    const key = encrypt('123456');
    // console.log(key);
    const deKey = encrypt('123456');
    // console.log(deKey);
  }, []);

  const info = {
    2012: [{year: "2012", lxly: "证劵市场", lxbl: "0", lxfx: "流入", sx: "2"}],
    2017: [
      {year: "2017", lxly: "房地产", lxbl: "5%", lxfx: "流入", sx: "1"},
      {year: "2017", lxly: "证劵市场", lxbl: "10%", lxfx: "流入", sx: "2"},
      {year: "2017", lxly: "投资担保", lxbl: "12.86%", lxfx: "流入", sx: "3"},
      {year: "2017", lxly: "其他", lxbl: "72.14%", lxfx: "流入", sx: "4"}],
    2018: [
      {year: "2018", lxly: "房地产", lxbl: "0", lxfx: "流入", sx: "1"},
      {year: "2018", lxly: "投资担保", lxbl: "0", lxfx: "流入", sx: "3"},
      {year: "2018", lxly: "其他", lxbl: "72.14%", lxfx: "流入", sx: "4"},
    ],
    2019: [
      {year: "2019", lxly: "房地产", lxbl: "5%", lxfx: "流入", sx: "1"},
      {year: "2019", lxly: "证劵市场", lxbl: "10%", lxfx: "流入", sx: "2"},
      {year: "2019", lxly: "投资担保", lxbl: "12.86%", lxfx: "流入", sx: "3"},
      {year: "2019", lxly: "其他", lxbl: "72.14%", lxfx: "流入", sx: "4"}
    ],
    2021: [
      {year: "2021", lxly: "房地产", lxbl: "0", lxfx: "流入", sx: "1"},
      {year: "2021", lxly: "证劵市场", lxbl: "10%", lxfx: "流入", sx: "2"},
      {year: "2021", lxly: "投资担保", lxbl: "12.86%", lxfx: "流入", sx: "3"},
      {year: "2021", lxly: "其他", lxbl: "72.14%", lxfx: "流入", sx: "4"},
    ]
  }

  useEffect(() => {
    window.setTimeout(() => {
      console.log('1')
    },10)
  },[])

  useEffect(() => {
    const performance = window.performance || window.msPerformance || window.webkitPerformance
    if (performance) {
      console.log(performance)
      //白屏时间，单位为十万毫秒
      // if ((performance.timing.responseStart  - performance.timing.navigationStart) < 10000*100) {
      //   window.location.reload()
      // }

    //   if (performance.memory.totalJSHeapSize - performance.memory.usedJSHeapSize < performance.memory.jsHeapSizeLimit/3) {
    //      window.location.reload()
    //   }
    }
  },[])
 
  


  const onFinish = (values: any): void => {
    setLoading(true);
    handleLogin({ ...values });
  };
  const handleLogin = (data?: any) => {
    login(data).then((res) => {
      if (res.err_code === 0) {
        let userInfo = Jwt_decode(res.data);
        console.log(userInfo);
        sessionStorage.setItem('token', res.data);
        message.success('登录成功');
        history.replace('/dashboard');
      } else {
        message.warning(res.msg);
      }
      setLoading(false);
    });
  };
  return (
    <Spin spinning={loading} tip={'登录中'}>
      <Layout className={styles.loginLayout}>
        <Content className={styles.loginContent}>
          <img className={styles.logo} src="" alt="" />
          <h1 className={styles.title}>后台管理系统</h1>
          <Form style={{ width: '240px' }} form={form} onFinish={onFinish}>
            <Form.Item
              name="username"
              rules={[{ required: true, message: '请输入用户名！' }]}
            >
              <Input
                autoFocus
                prefix={<UserOutlined />}
                placeholder={'请输入用户名'}
              ></Input>
            </Form.Item>
            <Form.Item
              name="password"
              rules={[{ required: true, message: '请输入密码' }]}
            >
              <Input.Password
                prefix={<LockOutlined />}
                placeholder={'请输入密码'}
              />
            </Form.Item>
            <Form.Item style={{ width: '100%' }}>
              <Button
                className={styles.loginBtn}
                type={'primary'}
                htmlType="submit"
              >
                登录
              </Button>
            </Form.Item>
          </Form>
        </Content>
      </Layout>
    </Spin>
  );
};

export default Index;
